<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
         #div1{
            width: 50px;
            height: 50px;
            background-color: pink;
            position: absolute;
        }
    </style>
</head>
<body>
    <div id="div1"></div>
    <script>

        // function fn1(){
        //     var a=1;
        //     return;
        //     console.log(a);
        // }
        // fn1();
        // 遇到return，跳出函数，不再执行return后面的语句，输出时没有结果




        // function fn1(){
        //     var a=1;
        //     var b=2;
        //     return a+b;
        // }

        // var s=fn1();
        // console.log(s);

        // 使用return 返回一个运行结果，或者一个值，仅能返回一个
        // 返回的结果可以在函数执行时赋值给变量
        // 记住这种书写方式！


        // function fn1(a){
        //     if(!a) return;
        //     var s=a+5;
        //     console.log(s);
        // }
        // fn1(5);
        // fn1();
        // 第一个fn1输出结果为5，直接带入函数即可
        // 第二个fn1输出结果无输出值，因为在条件不满足时，遇到return跳出函数
        // 不执行后边的输出程序
        // return限定函数传入参数类型或者其值的范围，来判断是否继续执行该函数还是跳出


// 数值转中文：

// var arr=["零","一", "二","三","四","五","六","七","八","九","十"]
// function getChineseNumber(n){
//     if(n>1000) return;
//     if(n<11) return arr[n];
//     if(n<20) return "十" + arr[n%10];
//     if(n%10===0 && n<100) return arr[n/10]+"十";
//     if(n<100) return arr[parseInt(n/10)]+"十"+arr[n%10];
//     if(n%100===0) return arr[n/100]+"百";
//     if(n%10===0) return arr[parseInt(n/100)]+"百"+arr[n%10/100]+"十";
//     if(parseInt(n/10)%10===0) return arr[parseInt(n/100)]+"百零"+arr[n%10];
//     return arr[parseInt(n/100)]+"百"+arr[parseInt(n/10)%10]+"十"+arr[n%10];

// }

// var str=getChineseNumber();
// console.log(str);



    //     function getArrSum(arg,type){
    //        var s=arg[0];
    //        for(var i=1;i<arg.length;i++){
    //            switch(type){
    //                case "+":
    //                s+=arg[i];
    //                break;
    //                case "-":
    //                s-=arg[i];
    //                break;
    //                case "*":
    //                s*=arg[i];
    //                break;
    //                case "/":
    //                s/=arg[i];
    //                break;
    //            }
    //        }
    //        return s;
    //     }

    //    var s=getArrSum([5,6,7],"+");
    //    console.log(s);

// 输出结果为18   arg是数组，type是选择类型，要输出s的值，就需要得到从for循环中
// return返回的值，数组内的元素依次带入求和


    // break跳出循环，执行函数中循环后的语句
    // return 跳出函数，直接从循环中跳出函数

// break 在执行时，只是跳出当前循环，后面的并列程序还会运行
// return 跳出当前函数，整个函数都跳出去，后面什么都不执行




        // var bool=false;
        // var x=0;
        // var div1=document.getElementById("div1");
        // div1.onclick=function(){
        //     bool=!bool;
        // }

        // setInterval(function(){
        //     if(!bool) return;
        //     x++;
        //     div1.style.left=x+"px";
        // },16);

// 利用上方的css代码，操纵盒子，点击移动，再次点击停止，因为开始状态是false，在
// 下方进行if判断时，由于return无法执行后面的代码，点击后if条件达成，盒子移动



        // var o;
        // function fn1(){
        //     return o || {};
        // }

        // var a=fn1();
        // var b=fn1();
 
        
        // (o // {}); 这个意思是条件运算，当o是真时返回//，当o是假时返回{}
// 当执行a的fn1时，由于o没有进行赋值，所以o等于undefined，判断时o就等于false
// 所以返回的是一个对象，b执行时也返回一个对象，所以两个对象不相等


        // var o;
        // function fn1(){
        //     return o || (o={});
        // }

        // var a=fn1();
        // var b=fn1();

            
// 较上一个作比较，在执行a中的fn1时，结果为o={},就是把空对象赋值给o,现在o就是一个空对象
// 在执行b中的fn1时，因为o在函数中被赋值，所以o是全局变量，直接把值返回给b，所以a和b相等

// 单例模式：每次产生都是同一个
        // var o;
        // function fn1(){
        //     if(!o)o={};
        //     return o;
        // }
        // var a=fn1();
        // var b=fn1();
       
// 细想之后，等同于上面的效果


            // function fn1(name,age,sex){
            // return {
            //     name:name,
            //     age:age,
            //     sex:sex
            //      }
            // }
            //  var o=fn1("谢天",30,"男");
            // console.log(o);

// 输出结果为object，里面包含了一一对应关系，将fn1中的元素按顺序带入
// name="谢天" age="30" sex="男"




// 工厂模式：每次产生新的对象
// function fn1(name,age,sex){
//             return {name,age,sex};
//         }

//         var o=fn1("谢天",30,"男");
//         var o1=fn1("张慧",20,"女");
//         console.log(o,o1);

        // 对象的属性名如果和值的变量名相同，可以直接带入
    // 输出结果为两个object，里面同上一个相同，在输出时注意o和o1也是用逗号隔开


// 返回多个数据：两种方式

// 一：利用数组

        // function fn1(a,b){
        //     a++;
        //     b*=2;
        //     return [a,b];
        // }
        // var arr=fn1(3,5);
        // console.log(arr);

// 记住书写方式


        
// 二：利用对象
        // function fn1(a,b){
        //     a++;
        //     b*=2;
        //     return {a,b};
        // }

        // var o=fn1(3,5);
        //  console.log(o);

// 记住书写方式



        // function fn1(a){
        //     return function(b){
        //         console.log("aaaa");
        //     }
        // }

        // var f=fn1();
        // f();

// 执行f时就是执行fn1，想要输出函数，必须先给函数定义给f，再执行f时，就是运行函数


        



// ---------------------闭包
        // function fn1(a){
        //     return function(b){
        //         console.log("aaaa");
        //     }
        // }

        // fn1(a)(b);
// 执行fn1时，第一个括号就代表着执行fn1第一个函数，第二个括号是执行第二个函数
// 当函数中有变量a和b时，就意味着把a b的值带进去，如果直接带入就会报错





// --------------返回回调函数运行的结果
            // function fn1(a){
            //     a++;
            //   return fn2(a);
            // }

            // function fn2(a){
            //     a*=2;
            //    return fn3(a);
            // }

            // function fn3(a){
            //     a+=10;
            //     return a;
            // }

            // var s=fn1(5);
            // console.log(s);

// 输出结果为21    执行fn1时 依次执行后面的函数，再利用return返回a的值



// 返回回调函数返回的值：
            // function fn1(a,fn){
            //     a++;
            //   return fn(a);
            // }

            // var s=fn1(5,function(n){
            //     return n*2;
            // });
            // console.log(s);

// 输出结果12   执行fn1 时，5传递给了a ，function传递给了fn，运行后a为6，
// 执行到fn(a)时，就是调用就是调用回调函数fn1中的fn，调用fn就是调用function这个函数
// 将6带入后值为12







// 对象中的函数
            // var obj={
            //     a:1,
            //     b:function(){
            //         console.log(obj.a)
            //     }

            // }

            // obj.b()
// 执行时调用function函数，输出结果不能输出a，会报错，应该写obj.a 才会对应的输出结果




        // var obj={
        //     a:1,
        //     b:function(){
        //         console.log(obj.a);
        //     }
        // }
        // var o=obj;
        // obj={
        //     c:10
        // }
        // obj.b()
        // o.b()

// 执行obj.b时，会报错，因为obj已经变成o
// 执行o.b时，结果为undefined 因为此时的o={c:10}，已经不存在a属性 





            var a=10;
            var obj={
                a:1,
                c:this.a,
                // (不存在时)
                b:function(){
                    console.log(this.a);
                }
            }
            // (对象创建完)

            var o=obj;
            obj={c:10};

            o.b();
            console.log(o);

// 当obj中的c不存在时，输出this.a 时就是当前对象的a属性，结果为1
// 当c存在时，程序时从上往下走的，此时c里边调用的不是obj里a的属性，
// 因为此时对象还没有创建完，所以在对象还没创建完时，此时的c指向的是
// window属性，结果为10

// 只有指向方法(function)中的this才指向对象





// 通过return this 来让对象中的方法实现连缀
            // var obj={
            //     a:1,
            //     run:function(){
            //         console.log("run");
            //         return this;
            //     },
            //     play:function(){
            //         console.log("play");
            //         return this;
            //     }
            // }


            // obj.run().play();
            // obj.play().run();

// return this 后返回一个对象，这个对象可以继续执行，当两个对象都被return时，
// 可以相互执行
























    </script>
</body>
</html>